<template>
	<view class="page">
		<view class="flex align-center justify-between bg-white text-lg text-bold custom "
			:style="[{height: CustomBar+'px',paddingTop: StatusBar+'px'}]">
			<text class="cuIcon-back padding-left" @click="back"></text>
			<text>信息审核</text>
			<text></text>
		</view>
		<view class="result-info margin-lr margin-top text-center bg-white padding-tb-xl text-df" v-if="info.joinin_state == 1 ||info.joinin_state == 4">
      <!-- <image src="../../static/rz-bg.png" mode=""></image> -->
			<view class="result-info-title text-lg">
				<view class="flex flex-direction  align-start check-box" v-if="info.joinin_state == 1">
					<text class="margin-top-sm text-333 text-bold" style="font-size: 36rpx;"> 待认证审核</text>
          <image src="../../static/line.png" mode="" ></image>
				</view>

				<view class="flex flex-direction align-start  check-box" v-if="info.joinin_state == 4">

					<text class="margin-top-sm text-333 text-bold"  style="font-size: 36rpx;"> 待财务审核</text>
          <image src="../../static/line.png" mode="" ></image>
				</view>

			</view>



		</view>
    <view class="result-infos margin-lr margin-top  bg-white padding-tb-xl text-df" v-if="info.joinin_state == 2 ||info.joinin_state == 5">
      <!-- <image src="../../static/rz-bg.png" mode=""></image> -->
    	<view class="result-info-title text-lg" style="margin-left: 71rpx;">

    		<text v-if="info.joinin_state == 2" class="text-333 text-bold"> 审核通过</text>

        <view class="flex flex-direction">
          <text v-if="info.joinin_state == 5" class="text-333 text-bold"> 审核通过</text>
          <image src="../../static/line.png" mode=""  v-if="info.joinin_state == 5" style="width: 128rpx;height: 8rpx;"></image>
        </view>


    	</view>
    	<!-- <view class="text-666 margin-top-xs" v-if="info.joinin_state == 1 || info.joinin_state == 4 ">信息审核中，请稍等~</view>
      <view class="text-666 margin-top-xs" v-if="info.joinin_state == 3 || info.joinin_state == 6 ">信息审核失败，请重试~</view> -->
    	<view class="btn-wrap flex  margin-top"
    		v-if="info.joinin_state == 2 || info.joinin_state == 6">
    		<view class="btn" @click="handlerPay"> 去支付</view>
    	</view>

    	<view class="btn-wrap flex  margin-top" v-if="info.joinin_state == 5">
    		<view class="btn" @click="goLogin"> 去登录</view>
    	</view>
    </view>
    <view class="result-infoss margin-lr margin-top  bg-white padding-tb-xl text-df" v-if="info.joinin_state == 3 ||info.joinin_state == 6">
      <!-- <image src="../../static/rz-bg.png" mode=""></image> -->
    	<view class="result-info-title text-lg" style="margin-left: 71rpx;">

    		<text v-if="info.joinin_state == 3" class="text-333 text-bold"> 审核失败</text>


    		<text v-if="info.joinin_state == 6" class="text-333 text-bold"> 审核失败</text>
    	</view>
    	<!-- <view class="text-666 margin-top-xs" v-if="info.joinin_state == 1 || info.joinin_state == 4 ">信息审核中，请稍等~</view>
      <view class="text-666 margin-top-xs" v-if="info.joinin_state == 3 || info.joinin_state == 6 ">信息审核失败，请重试~</view> -->
    	<view class="btn-wrap flex justify-center margin-top"
    		v-if="info.joinin_state == 2 || info.joinin_state == 6">
    		<view class="btn" @click="handlerPay"> 去支付</view>
    	</view>
    	<view class="btn-wrap flex  margin-top" v-if="info.joinin_state == 3">
    		<view class="btn" @click="handlerAddInfo">重新提交</view>
    	</view>

    </view>
		<view class="margin-lr " v-if="info.joinin_state == 3 || info.joinin_state == 6 ">
			<view class="padding-lr padding-tb-sm margin-top-sm text-df text-666">
				审核信息
			</view>
			<view class="bg-white radius-16  padding text-df">
				<view class="_left" style='margin-bottom: 10rpx'>
					拒绝理由
				</view>
				<view class="_right text-cut  text-cut  ">
					{{info.reason? info.reason:'无'}}
				</view>
			</view>
		</view>
		<!-- <view class="padding-lr padding-tb-sm margin-top-sm text-df text-666">
      会员信息
    </view>
    <view class="shop-item bg-white height-100 padding-lr text-df flex justify-between align-center solid-bottom">
      <view class="_left">
        会员昵称
      </view>
      <view class="_right text-cut  text-cut  text-right">
        13246533724
      </view>
    </view> -->
		<view class="padding-lr padding-tb-sm margin-top-sm text-df text-666">
			{{info.person.length>0?'个人信息':'企业信息'}}
		</view>
		<view class="margin-lr radius-16">
			<view class="shop-item bg-white height-100 padding-lr text-df flex justify-between align-center"
				v-for="item in info.person" :key="item.name">
				<view class="_left">
					{{item.name}}
				</view>
				<view class="_right   text-right" :class="{'image':item.img}">
					<block v-if="item.val">
						{{item.val}}
					</block>
					<image class="img" v-else :src="item.img" mode="heightFix" @click="preview(item.img)"></image>
				</view>
			</view>
			<view
				class="shop-item bg-white height-100 padding-lr text-df flex justify-between align-center solid-bottom"
				v-for="item in info.company" :key="item.name">
				<view class="_left">
					{{item.name}}
				</view>
				<view class="_right  text-right" :class="{'image':item.img}">

					<block v-if="item.val">
						{{item.val}}
					</block>
					<image class="img" v-else :src="item.img" mode="heightFix" @click="preview(item.img)"></image>
				</view>
			</view>
		</view>
		<view class="padding-lr padding-tb-sm margin-top-sm text-df text-666" v-if="info.pay.length > 0 ">
			{{i18n['支付信息']}}
		</view>
		<view class="margin-lr radius-16">
			<view class="shop-item bg-white height-100 padding-lr text-df flex justify-between align-center "
				v-for="item in info.pay" :key="item.name">
				<view class="_left">
					{{item.name}}
				</view>
				<view class="_right   text-right" :class="{'image':item.img}">
					<block v-if="item.val">
						{{item.val}}
					</block>
					<image v-else class="img" :src="item.img" mode="heightFix" @click="preview(item.img)"></image>
				</view>
			</view>
		</view>
		<view class="padding-lr padding-tb-sm margin-top-sm text-df text-666">
			银行信息
		</view>
		<view class="margin-lr radius-16">
			<view class="shop-item bg-white height-100 padding-lr text-df flex justify-between align-center"
				v-for="item in info.settlement" :key="item.name">
				<view class="_left">
					{{item.name}}
				</view>
				<view class="_right  text-right" :class="{'image':item.img}">

					<block v-if="item.val">
						{{item.val}}
					</block>
					<image v-else class="img" :src="item.img" mode="heightFix" @click="preview(item.img)"></image>
				</view>
			</view>
		</view>
		<view class="padding-lr padding-tb-sm margin-top-sm text-df text-666">
	店铺信息
		</view>
		<view class="margin-lr radius-16">
			<view class="shop-item bg-white height-100 padding-lr text-df flex justify-between align-center"
				v-for="item in info.store" :key="item.name">
				<block v-if="item.name == '资质证明' && item.val.length != 0">
					<view class="_left">
						{{item.name}}
					</view>
					<view class="_right text-right flex justify-end"
						style="flex-direction: column; align-items: flex-end; padding-bottom: 32rpx;">
						<view style="width: 500rpx; display: flex; flex-wrap: wrap;">
							<view class="img-wrap" v-for="(item1, index1) of item.val" :key="index1"
								style="width: 230rpx; height: 150rpx; margin-top: 16rpx; margin-left: 16rpx;">
								<image class="img" :src="item1" mode="aspectFit" @click="preview(item1)"></image>
							</view>
						</view>
					</view>
				</block>
				<block v-else>
					<view class="_left">
						{{item.name}}
					</view>
					<view class="_right  text-right" :class="{'image':item.img}">
						<block v-if="item.val">
							{{item.val}}
						</block>
						<image v-else class="img" :src="item.img" mode="heightFix" @click="preview(item.img)"></image>
					</view>
				</block>
			</view>
		</view>
	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: {
					pay: [],
					company: [],
					person: [],
					licence: '',
					settlement: [],
					store: [],
					reason: '',
					account: ''
				}
			}
		},
		onShow() {
			this.getData();
			this.getPayInfo();
		},
		onLoad(option) {

			// let pages = getCurrentPages();
			// let prevPage = pages[pages.length - 2]; //上一个页面
			// console.log(JSON.stringify(pages),JSON.stringify(prevPage))
		},
		onPullDownRefresh() {
			this.getData();
			uni.stopPullDownRefresh();
		},
		methods: {
			getPayInfo() {
				let store_joinin_id = uni.getStorageSync('store_joinin_id') || 0;
				let store_user_id = uni.getStorageSync('store_user_id') || 0;
				this.$api.post(global.apiUrls.payInfo, {}, {
					header: {
						Storeid: store_joinin_id,
						Userid: store_user_id
					}
				}).then(res => {
					console.log(res);
					if (res.data.code == 1) {
						this.account = res.data.data.account;
					}
				}).catch(err => {
					console.log(err);
				})
			},
			handlerLogin() {
				this.$message.info('请通过链接下载商家端app');
			},
			preview(url) {
				uni.previewImage({
					current: url,
					urls: [url]
				})
			},
			// 去支付
			handlerPay() {
				uni.navigateTo({
					url: '/pages/user/shop/shop-pay/index'
				})
				// let postdata = {
				// 	order_type: 13,
				// 	order_money: this.account.money
				// }

				// this.$api.post(global.apiUrls.postCreateOrder, postdata).then(res => {
				//   if (res.data.code == 1) {
				//     this.$message.info(this.i18n['订单提交成功，请支付…']);
				//     this.$api
				//       .get(global.apiUrls.getOrderDetail, {
				//         order_sn: res.data.data.order_sn,
				//         order_type: 13
				//       })
				//       .then(response => {
				//         setTimeout(() => {
				//           this.$urouter.redirectTo({
				//             url: '/pages/goods/shop/pay-order/index',
				//             params: {
				//               order_sn: res.data.data.order_sn,
				//               order_type: 13
				//             }
				//           });
				//         }, 500);
				//       });
				//   } else {
				//     this.$message.info(res.data.msg);
				//   }
				// });
			},
			// 重填信息
			handlerAddInfo() {
				uni.navigateTo({
					url: '/pages/user/shop/shop-agreement/index'
				})
			},
			goLogin(){
				uni.reLaunch({
					url: '/pages/user/login/login-password/index'
				});
			},
			back() {
				// uni.navigateBack()
				uni.reLaunch({
					url: '/pages/user/login/login-password/index'
				});
			},
			getData() {
				let store_joinin_id = uni.getStorageSync('store_joinin_id') || 0;
				let store_user_id = uni.getStorageSync('store_user_id') || 0;
				this.$api.post(global.apiUrls.apply, {}, {
					header: {
						Storeid: store_joinin_id,
						Userid: store_user_id
					}
				}).then(res => {
					console.log(res);
					if (res.data.code == 1) {
						this.info = res.data.data;
					} else {
						this.$message.info(res.data.msg);
					}
				}).catch(err => {
					console.log(err);
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.page {
		padding-bottom: 120rpx;
	}

	.check-box {
    margin-left: 64rpx;
		image {
			width: 182rpx;
			height: 8rpx;
		}
	}

	.result-info {
		border-radius: 16rpx;
    height: 210rpx;
    background:url('../../static/rz-bg.png') no-repeat left top;
    background-size: 100% 100%;
	}
  .result-infos {
  	border-radius: 16rpx;
    height: 210rpx;
    background:url('../../static/rz-bg2.png') no-repeat left top;
    background-size: 100% 100%;
  }

  .result-infoss {
  	border-radius: 16rpx;
    height: 210rpx;
    background:url('../../static/rz-bg-1.png') no-repeat left top;
    background-size: 100% 100%;
  }

	.result-info-title {
		color: #FF9B26;
	}

	.height-100 {
		min-height: 100rpx;
		height: initial;
	}

	.text-bf {
		color: #bfbfbf;
	}

	.shop-item {
		._left {
			width: 300rpx;
		}

		._right {
			width: calc(100% - 300rpx);
			display: flex;
			align-items: center;
			justify-content: flex-end;
			text-align: right;

			&.image {
				padding: 20rpx 0;
			}

			.up-img {
				width: 320rpx;
				height: 150rpx;
				border: 1px dashed #EEEEEE;
				position: relative;

				&::before {
					content: '';
					width: 60rpx;
					height: 4rpx;
					background: #EEEEEE;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
				}

				&::after {
					content: '';
					width: 4rpx;
					height: 60rpx;
					background: #EEEEEE;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
				}
			}

			.img {
				height: 150rpx;
			}

		}
	}

	.btn-wrap {
		.btn {
			width: 160rpx;
			height: 64rpx;
			line-height: 64rpx;
			text-align: center;
			font-size: 28rpx;
			color: #FA9B46;
			// background: $bgtheme;
      border: 1rpx solid #FA9B46;
			border-radius: 32rpx;
      margin-left: 52rpx;
		}

	}

	.finish {
		color: #FA9B46;
    margin-left: 71rpx;
	}

	.custom {
		position: sticky;
		top: 0;
		width: 100%;
		left: 0;
		z-index: 9999;

	}

	.radius-16 {
		border-radius: 16rpx !important;
		overflow: hidden;
	}
</style>
